<!--买家中心-->
<div class="row" style="margin-top:15px;">
    <div class="col-lg-12">
        <div class="col-xs-6 col-md-3">
            <div class="panel bg-blue">
                <div class="panel-body">
                    <div class="panel-title">
                        <span class="label label-success pull-right">{:__('Real time')}</span>
                        <h5>实物订单</h5>
                    </div>
                    <div class="row">
                        <div class="col-md-12">
                            <h1 class="no-margins">{$buyer['order_count']}</h1>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-4">
                            <div class="stat-percent font-bold text-gray"><i class="fa fa-commenting"></i>{$buyer['waitPay']}</div>
                            <small>待付款</small>
                        </div>
                        <div class="col-md-4">
                            <div class="stat-percent font-bold text-gray"><i class="fa fa-commenting"></i>{$buyer['waitSend']}</div>
                            <small>待发货</small>
                        </div>
                        <div class="col-md-4">
                            <div class="stat-percent font-bold text-gray"><i class="fa fa-commenting"></i>{$buyer['waitReceive']}</div>
                            <small>待收货</small>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-xs-6 col-md-3">
            <div class="panel bg-green-gradient">
                <div class="panel-body">
                    <div class="ibox-title">
                        <span class="label label-primary pull-right">{:__('Real time')}</span>
                        <h5>退换货数</h5>
                    </div>
                    <div class="row">
                        <div class="col-md-12">
                            <h1 class="no-margins">{$buyer['return_count']}</h1>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-6">
                            <div class="font-bold text-navy"><i class="fa fa-modx"></i>{$buyer['rejecteds']}</div>
                            <small>拒收数</small>
                        </div>
                        <div class="col-md-6">
                            <div class="font-bold text-navy"><i class="fa fa-modx"></i>{$buyer['canceleds']}</div>
                            <small>取消数</small>
                        </div>
                    </div>

                </div>
            </div>
        </div>

        <div class="col-xs-6 col-md-3">
            <div class="panel bg-aqua-gradient">
                <div class="panel-body">
                    <div class="ibox-title">
                        <span class="label label-info pull-right">{:__('Real time')}</span>
                        <h5>收藏统计</h5>
                    </div>
                    <div class="row">
                        <div class="col-md-6">
                            <h1 class="no-margins">{$buyer['collect_goods']}</h1>
                            <div class="font-bold text-navy"><i class="fa fa-tags"></i> </div><small>收藏商品数</small>
                        </div>
                        <div class="col-md-6">
                            <h1 class="no-margins">{$buyer['collect_shop']}</h1>
                            <div class="font-bold text-navy"><i class="fa fa-heart"></i> </div><small>收藏店铺数</small>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-xs-6 col-md-3">
            <div class="panel bg-purple-gradient">
                <div class="panel-body">
                    <div class="ibox-title">
                        <span class="label label-primary pull-right">{:__('Real time')}</span>
                        <h5>评价统计</h5>
                    </div>
                    <div class="ibox-content">
                        <div class="row">
                            <div class="col-md-6">
                                <h1 class="no-margins">{$buyer['uncomment_count']}</h1>
                                <div class="font-bold text-navy"><i class="fa fa-commenting"></i> </div><small>未评价数</small>
                            </div>
                            <div class="col-md-6">
                                <h1 class="no-margins">{$buyer['comment_count']}</h1>
                                <div class="font-bold text-navy"><i class="fa fa-comment"></i> </div><small>已评价数</small>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

</div>

<!--卖家中心-->
{if cookie("shop_id")}
<style type="text/css">
    .sm-st {
        background: #fff;
        padding: 20px;
        -webkit-border-radius: 3px;
        -moz-border-radius: 3px;
        border-radius: 3px;
        margin-bottom: 20px;
        -webkit-box-shadow: 0 1px 0px rgba(0, 0, 0, 0.05);
        box-shadow: 0 1px 0px rgba(0, 0, 0, 0.05);
    }

    .sm-st-icon {
        width: 60px;
        height: 60px;
        display: inline-block;
        line-height: 60px;
        text-align: center;
        font-size: 30px;
        background: #eee;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        border-radius: 5px;
        float: left;
        margin-right: 10px;
        color: #fff;
    }

    .sm-st-info {
        font-size: 12px;
        padding-top: 2px;
    }

    .sm-st-info span {
        display: block;
        font-size: 24px;
        font-weight: 600;
    }

    .orange {
        background: #fa8564 !important;
    }

    .tar {
        background: #45cf95 !important;
    }

    .sm-st .green {
        background: #86ba41 !important;
    }

    .pink {
        background: #AC75F0 !important;
    }

    .yellow-b {
        background: #fdd752 !important;
    }

    .stat-elem {

        background-color: #fff;
        padding: 18px;
        border-radius: 40px;

    }

    .stat-info {
        text-align: center;
        background-color: #fff;
        border-radius: 5px;
        margin-top: -5px;
        padding: 8px;
        -webkit-box-shadow: 0 1px 0px rgba(0, 0, 0, 0.05);
        box-shadow: 0 1px 0px rgba(0, 0, 0, 0.05);
        font-style: italic;
    }

    .stat-icon {
        text-align: center;
        margin-bottom: 5px;
    }

    .st-red {
        background-color: #F05050;
    }

    .st-green {
        background-color: #27C24C;
    }

    .st-violet {
        background-color: #7266ba;
    }

    .st-blue {
        background-color: #23b7e5;
    }

    .stats .stat-icon {
        color: #28bb9c;
        display: inline-block;
        font-size: 26px;
        text-align: center;
        vertical-align: middle;
        width: 50px;
        float: left;
    }

    .stat {
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        display: inline-block;
        margin-right: 10px;
    }

    .stat .value {
        font-size: 20px;
        line-height: 24px;
        overflow: hidden;
        text-overflow: ellipsis;
        font-weight: 500;
    }

    .stat .name {
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .stat.lg .value {
        font-size: 26px;
        line-height: 28px;
    }

    .stat.lg .name {
        font-size: 16px;
    }

    .stat-col .progress {
        height: 2px;
    }

    .stat-col .progress-bar {
        line-height: 2px;
        height: 2px;
    }

    .item {
        padding: 30px 0;
    }
</style>

<div class="row" style="margin-top:15px;">
    <div class="col-md-8">
        <div class="box box-info">
            <div class="box-header with-border">
                <h3 class="box-title">订单提示</h3>
                <div class="box-tools pull-right">
                    <button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i></button>
                    <button type="button" class="btn btn-box-tool" data-widget="remove"><i class="fa fa-times"></i></button>
                </div>
            </div>
            <div class="box-body">
                <div class="row">
                    <div class="col-md-8">
                        <div class="chart-responsive">
                            <canvas id="pieChart" height="300"></canvas>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="box box-info">
            <div class="box-header with-border">
                <h3 class="box-title">商品信息</h3>
                <div class="box-tools pull-right">
                    <button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i></button>
                    <button type="button" class="btn btn-box-tool" data-widget="remove"><i class="fa fa-times"></i></button>
                </div>
            </div>
            <div class="box-body">
                <div class="row">
                    <div class="col-md-8">
                        <div class="chart-responsive">
                            <canvas id="pieChart2" height="300"></canvas>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="col-md-4">
        <div class="box box-primary">
            <div class="box-header with-border">
                <h3 class="box-title">最近七天销售排行</h3>
                <div class="box-tools pull-right">
                    <button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i>
                    </button>
                    <button type="button" class="btn btn-box-tool" data-widget="remove"><i class="fa fa-times"></i></button>
                </div>
            </div>
            <div class="box-body">
                <ul class="products-list product-list-in-box">
                    <li class="item">
                        <div class="product-img">
                            序号
                        </div>
                        <div class="product-info">
                            <a href="javascript:void(0)" class="product-title">
                                名称
                                <span class="label label-warning pull-right">数量</span>
                            </a>
                        </div>
                    </li>
                    {volist name="$seller['stat']['goodsTop']" id="glist" key="gkey" length="10"}
                    <li class="item">
                        <div class="product-img">{$gkey}</div>
                        <div class="product-info">
                            <a href="{:addon_url('mall/goods/detail',['ids'=>$glist.id])}" class="product-title" target="_blank">
                                {:mb_substr($glist.goodsname,0,15)}
                                <span class="label label-info pull-right">{$glist.goodsnum?:0}</span>
                            </a>
                        </div>
                    </li>
                    {/volist}
                </ul>
            </div>
            <div class="box-footer text-center">
                <a href="{:url('mall.goods.goods/index')}" class="uppercase">查看全部商品</a>
            </div>
        </div>

    </div>

</div>

<div class="row">
    <div class="col-lg-12">
        <div class="page-header">
            <h4 class="no-margin">订单趋势</h4>
        </div>
        <div id="datefilter">
            <form action="" role="form" novalidate class="form-inline">
                <a href="javascript:;" class="btn btn-primary btn-refresh"><i class="fa fa-refresh"></i></a>
                <a href="javascript:;" class="btn btn-success btn-filter">{:__('Today')}</a>
                <a href="javascript:;" class="btn btn-success btn-filter">{:__('Yesterday')}</a>
                <a href="javascript:;" class="btn btn-success btn-filter">{:__('Last 7 Days')}</a>
                <a href="javascript:;" class="btn btn-success btn-filter">{:__('Last 30 Days')}</a>
                <a href="javascript:;" class="btn btn-success btn-filter">{:__('Last month')}</a>
                <a href="javascript:;" class="btn btn-success btn-filter">{:__('This month')}</a>
                <div class="input-group">
                    <span class="input-group-addon"><i class="fa fa-calendar"></i></span>
                    <input type="text" class="form-control input-inline datetimerange" placeholder="指定日期" style="width:270px;" />
                </div>
                <a href="javascript:;" class="btn btn-info btn-amount"><i class="fa fa-cny"></i> <span id="amount"></span></a>
            </form>
        </div>
        <div id="echart" style="height:400px;width:100%;"></div>
    </div>
</div>

<script type="text/javascript" src="__CDN__/assets/libs/jquery/dist/jquery.min.js"></script>
<script type="text/javascript" src="__CDN__/assets/js/echarts.min.js"></script>
<script type="text/javascript" src="__CDN__/assets/js/echarts-theme.js"></script>
<script type="text/javascript">
    var shop = [
        {:json_encode($seller['shop'])},
    ];
    var stat = [
        {:json_encode($seller['stat'])},
    ];
    var column = [
        {:json_encode($column)},
    ];
    var orders = [
        {:json_encode(array_values($orderList))},
    ];
    var ordersrc = [
        {:json_encode(array_values($orderSrc))},
    ];
</script>
<script data-render="script">
    $(function () {
        // 基于准备好的dom，初始化echarts实例
        var pieChart = echarts.init(document.getElementById('pieChart'), '2d')
        var pieOptions = {
            tooltip: {
                trigger: 'item',
                formatter: "{a} <br/>{b} : {c} ({d}%)"
            },
            legend: {
                orient: 'vertical',
                x: 'right',
                data: ['待付款', '待收货', '待发货', '取消/拒收', '待退款']
            },
            toolbox: {
                show: false,
                feature: {
                    mark: {show: true},
                    dataView: {show: true, readOnly: false},
                    magicType: {
                        show: true,
                        type: ['pie', 'funnel'],
                        option: {
                            funnel: {
                                x: '25%',
                                width: '50%',
                                funnelAlign: 'center',
                                max: 1548
                            }
                        }
                    },
                    restore: {show: true},
                    saveAsImage: {show: true}
                }
            },
            calculable: true,
            series: [
                {
                    name: '订单信息',
                    type: 'pie',
                    radius: ['50%', '70%'],
                    itemStyle: {
                        normal: {
                            label: {
                                show: false
                            },
                            labelLine: {
                                show: false
                            }
                        },
                        emphasis: {
                            label: {
                                show: true,
                                position: 'center',
                                textStyle: {
                                    fontSize: '30',
                                    fontWeight: 'bold'
                                }
                            }
                        }
                    },
                    data: [
                        {value: stat.orderNeedpayCnt, name: '待付款'},
                        {value: stat.waitReceiveCnt, name: '待收货'},
                        {value: stat.waitDeliveryCnt, name: '待发货'},
                        {value: stat.cancelCnt, name: '取消/拒收'},
                        {value: stat.orderRefundCnt, name: '待退款'}
                    ]
                }
            ]
        };
        pieChart.setOption(pieOptions);

        var pieChart2 = echarts.init(document.getElementById('pieChart2'), '2d')
        var pieOptions2 = {
            tooltip: {
                trigger: 'item',
                formatter: "{a} <br/>{b} : {c} ({d}%)"
            },
            legend: {
                orient: 'vertical',
                x: 'right',
                data: ['出售中', '仓库中', '预警库存', '待审核', '违规商品']
            },
            toolbox: {
                show: false,
                feature: {
                    mark: {show: true},
                    dataView: {show: true, readOnly: false},
                    magicType: {
                        show: true,
                        type: ['pie', 'funnel'],
                        option: {
                            funnel: {
                                x: '25%',
                                width: '50%',
                                funnelAlign: 'center',
                                max: 1548
                            }
                        }
                    },
                    restore: {show: true},
                    saveAsImage: {show: true}
                }
            },
            calculable: true,
            series: [
                {
                    name: '商品信息',
                    type: 'pie',
                    radius: ['50%', '70%'],
                    itemStyle: {
                        normal: {
                            label: {
                                show: false
                            },
                            labelLine: {
                                show: false
                            }
                        },
                        emphasis: {
                            label: {
                                show: true,
                                position: 'center',
                                textStyle: {
                                    fontSize: '30',
                                    fontWeight: 'bold'
                                }
                            }
                        }
                    },
                    data: [
                        {value: stat.onSaleCnt, name: '出售中'},
                        {value: stat.unSaleCnt, name: '仓库中'},
                        {value: stat.stockWarnCnt, name: '预警库存'},
                        {value: stat.waitAuditCnt, name: '待审核'},
                        {value: stat.illegalCnt, name: '违规商品'}
                    ]
                }
            ]
        };
        pieChart2.setOption(pieOptions2);

        var myChart = echarts.init(document.getElementById('echart'), 'walden');
        // 指定图表的配置项和数据
        var option = {
            title: {
                text: '',
                subtext: ''
            },
            tooltip: {
                trigger: 'axis'
            },
            legend: {
                data: ordersrc
            },
            toolbox: {
                show: false,
                feature: {
                    magicType: {show: true, type: ['stack', 'tiled']},
                    saveAsImage: {show: true}
                }
            },
            xAxis: {
                type: 'category',
                boundaryGap: false,
                data: column
            },
            yAxis: {},
            grid: [{
                left: 'left',
                top: 'top',
                right: '10',
                bottom: 30
            }],
            series: []
        };
        // 使用刚指定的配置项和数据显示图表。
        myChart.setOption(option);

        $(window).resize(function () {
            myChart.resize();
        });

        $(document).on("click", ".btn-filter", function () {
            var label = $(this).text();
            var obj = $(".datetimerange").data("daterangepicker");

            var dates = obj.ranges[label];
            obj.startDate = dates[0];
            obj.endDate = dates[1];

            obj.clickApply();
        });

        $(".datetimerange").on("blur", function () {
            Fast.api.ajax({
                url: 'mall/dashboard/getorders',
                data: {date: $(this).val()}
            }, function (data) {
                seriesList = [];
                $.each(orders, function (index, object) {
                    if (object.length() > 0) {
                        seriesList.push({
                            name: orderSrc.index,
                            data: object
                        })
                    }
                });

                myChart.setOption({
                    xAxis: {
                        data: column
                    },
                    series: seriesList
                });

                $.each(orders, function (index, object) {

                    $.each(object, function (i, j) {
                        if ($("#" + i).size() > 0) {
                            $("#" + i).text(j);
                        }
                    });
                    return false;
                });
            });
        });
        $(document).on("click", ".btn-refresh", function () {
            $(".datetimerange").trigger("blur");
        });

        //每隔一分钟定时刷新图表
        setInterval(function () {
            $(".btn-refresh").trigger("click");
        }, 60000);
    });

</script>
{/if}
